<template>
  <div>
      选择分类
     <subcate :data='catelist' @click="getcid" />

        <van-field
        v-model="name"
        name="名称"
        label="名称"
        placeholder="名称"
        :rules="[{ required: true, message: '请填写名称' }]"
        />

        <van-field
        v-model="description"
        name="描述"
        label="描述"
        placeholder="描述"
        />

        <van-field
        v-model="tname"
        name="讲师"
        label="讲师"
        placeholder="讲师"
        />

        <van-image
        width="100"
        height="100"
        :src="pic"
        />

        图片上传:<van-uploader :after-read='afterRead'/>
        视频上传:视频上传：<van-uploader :after-read="afterReadVedio" v-model="fileList" multiple 
        :max-count="3" accept=".mp4"/>
        <br>
        <van-button type='primary' @click="add">添加</van-button>
  </div>
 
</template>
<script>
// 导入子组件
import subcate from './subcate' 
export default {
    components:{
        'subcate':subcate
    },
    data(){
        return{
            name:'',
            description:'',
            tname:'',
            fileList:[],
            pic:'http://localhost:5000/static/upload/1.jpg',
            catelist:[],
            cid:0,
            vedios:[]

        }
    },
    methods:{
        //图片上传
        afterRead(file,type=1){
            alert(type)
            let data = new FormData()
            data.append('id',1)
            data.append('file',file.file)
            this.$axios.post('upload',data).then(res=>{
                //视频
                if(type == 2){
                    this.vedios.push(res.data.pic)
                }else{
                    this.pic = 'http://localhost:5000/static/upload/',res.data.pic
                }
            })
        },
        //视频上传
        afterReadVedio(){
            //遍历Filelist
            for(var i=0;i<this.fileList.length;i++){
                this.afterRead(this.fileList[i],2)
            }
        },
        //获取所有分类信息
        getCatelist(){
            this.$axios.get('cateM')
            .then(res=>{
                this.catelist = res.data.list
            })
        },
        //获取选中的分类id
        getcid(v){
            // 更新分类id
            this.cid = v
        },
        //添加
        add(){
            console.log(this.vedios)
        }
},
    mounted(){
        this.getCatelist()
    },
}
</script>

<style>

</style>